<template>
  <div>
    <u-cell-group>
      <u-cell-item icon="photo" title="头像" :arrow="false">
        <span slot="right-icon" class="imgs">
           <img :src="avatarUrl" alt="">
        </span>
      </u-cell-item>
      <u-cell-item icon="edit-pen" title="昵称" :value="nickName"  :arrow="false"></u-cell-item>
      <u-cell-item icon="account-fill" title="账号主体信息" :value="client_name"  :arrow="false"></u-cell-item>
      <u-cell-item icon="phone" title="手机账号" :value="account"  :arrow="false"></u-cell-item>
      <u-cell-item icon="lock-open" title="修改密码"  ></u-cell-item>
      <u-cell-item icon="error-circle" title="退出登录"  @click="toExit"></u-cell-item>
    </u-cell-group>
  </div>
</template>

<script>
export default {
  name: "info",
  data(){
    return{
      client_name:'',
      account:'',
      avatarUrl:'',
      nickName:'',
    }
  },
  onShow(){
    this.client_name = uni.getStorageSync('client_name')
    this.account = uni.getStorageSync('account')
    this.avatarUrl = uni.getStorageSync('avatarUrl')
    this.nickName = uni.getStorageSync('nickName')

  },
  methods:{
    toExit(){
      this.$confirm('是否退出登录？').then(res =>{
        uni.setStorageSync('client_name','');
        uni.setStorageSync('account','');
        uni.setStorageSync('mobile','');
        uni.setStorageSync('isLogin', false);
        uni.switchTab({
          url: '/pages/mine/index'
        })
          }).catch(err=>{console.log(err)})
    }
  }
}
</script>

<style scoped>

.imgs {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px #eee solid;
  margin-left: 50px;
  overflow: hidden;
}
.imgs img{
  width: 50px;
  height: 50px;
}
</style>